@namespace QCloud.Pages.Dashboard.Workplace

<AntDesign.Charts.Radar @ref="_chart" Config="_chartConfig"/>

@if (HasLegend)
{
    <Row Class="legend">
        <AntDesign.Col>
            <div class="legendItem">
                <p>
                    <span class="dot" style="background-color: #aaa"></span>
                    <span></span>
                </p>
                <h6></h6>
            </div>
        </AntDesign.Col>
    </Row>
}

@inject IChartService ChartService

@code
{
    [Parameter] public bool HasLegend { get; set; }

    [Parameter] public int Height { get; set; } = 343;

    private IChartComponent _chart;

    private readonly RadarConfig _chartConfig = new RadarConfig
    {
        Height = 343,
        AutoFit = true,
        XField = "label",
        YField = "value",
        RadiusAxis = new ValueAxis
        {
            Grid = new BaseAxisGrid
            {
                AlternateColor = new[] { "rgba(0, 0, 0, 0.04)", null }
            }
        },
        Area = new RadarViewConfigArea
        {
            Visible = false
        },
        Point = new RadarViewConfigPoint
        {
            Visible = true
        }
    };

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            var data = await ChartService.GetRadarDataAsync();
            await _chart.ChangeData(data);
        }

        await base.OnAfterRenderAsync(firstRender);
    }
}